{extend name="index/iframe" /}

{block name="content"}
<form class="layui-form layui-form-my" action="">
    <input type="hidden" name="id" value="{$Think.get.id}">
    <div class="layui-form-item">
        <label class="layui-form-label">礼包名称</label>
        <div class="layui-input-block">
            <input type="text" value="{$find.title}" disabled lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input layui-disabled">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">上传文件</label>
        <div class="layui-input-block">
            <div style="width: 100%;" class="layui-upload-drag" id="file">
                <i class="layui-icon">&#xe67c;</i>上传文件
            </div>
            <div class="layui-progress layui-progress-big" lay-filter="demo" lay-showPercent="true">
                <div class="layui-progress-bar layui-bg-green" lay-percent="0%"></div>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn my-btn" lay-submit="" lay-filter="submitBtn">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
{/block}

{block name="css"}{/block}

{block name="js"}
<script>
    layui.use(['form', 'layedit', 'laydate', 'upload', 'element'], function(){
        var form = layui.form
            ,$ = layui.$
            ,layer = layui.layer
            ,upload = layui.upload
            ,element = layui.element;

        //进度条
        element.progress('demo', '0%');

        //上传
        var ins = upload.render({
            elem: '#file' //绑定元素
            ,url: '{:url("Base/upload")}' //上传接口
            ,accept: 'file'
            ,exts: 'txt'
            ,size: 102400 //kb为单位，10M
            ,before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                if($('#game_id').val()==''){
                    layer.msg('请先选择游戏', {icon: 0, time:3000});
                }
                ins.config.data.name = 'bag';
                ins.config.data.game_id = $('#game_id').val();
                ins.config.data.id = {$Think.get.id};
                element.progress('demo', '80%');
            }
            ,done: function(json){
                if(json.code==0){
                    element.progress('demo', '100%');
                    $("input[name='file']").attr('type','hidden').val(json.data.src);
                    layer.msg(json.msg, {icon: 1, time:1000});
                }else{
                    layer.msg(json.msg, {icon: 2, time:1000});
                }
            }
            ,error: function(){
                layer.msg('连接超时，请联系管理员', {icon: 0, time:1000})
            }
        });

        //提交
        form.on('submit(submitBtn)', function(data){
            var load = layer.load();
            $.post('{:url("Bag/again")}',data.field, function(json){
                layer.close(load);
                json.code==0 ? layer.msg(json.msg, {icon: 1, time: 1000}) : layer.msg(json.msg, {icon: 0, time: 1000});
            }, 'JSON').error(function(){
                layer.close(load);
                layer.msg('连接超时，请联系后台管理员', {icon: 2, time:3000});
            });
            return false;
        });
    });
</script>
{/block}